export const metadata = {
  title: 'Trail Cursor Effect',
  description:
    'An interactive React component that adds a dynamic bubble effect, visually tracking cursor movement in real time.',
};

<ComponentCodePreview name='trail-cursor' />

## Props

| Prop           | Type          | Default                                                                                  | Description                                                            |
| -------------- | ------------- | ---------------------------------------------------------------------------------------- | ---------------------------------------------------------------------- |
| `element`      | `HTMLElement` | `undefined`                                                                              | The HTML element to which the trailing cursor effect is applied.       |
| `particles`    | `number`      | `15`                                                                                     | The number of particles in the trailing cursor effect.                 |
| `rate`         | `number`      | `0.4`                                                                                    | The rate of trailing cursor movement.                                  |
| `baseImageSrc` | `string`      | `'...'` (truncated) | Base64 image string used as the default particle for the cursor trail. |
